﻿<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="UTF-8">
		<title>活动页面</title>
		<style type="text/css">
		*{
			margin:0;
			padding:0;
		}
		html,
		body{
			height:100%;
		}
		.shouye{
			position:absolute;
			width:100%;
			height:100%;
		}
		.shouye>.bg{
			position:absolute;
			z-index:-1;
			width:100%;
			height:100%;
		}
		#page1{
			display:block;
		}
		#page1>.bg{
			background:url("Page/bg1.png") no-repeat center center;
			background-size:100%;
		}
		#leftpage>.left01{
			position:absolute;
			width:144px;
			height:55px;
			left:103px;
			top:258px;
			margin:auto;
			outline:none;
			background:url("Page/zhongjiang1.png") no-repeat center center;
			background-size:100%;
		}
		#leftpage>.left02{
			position:absolute;
			width:144px;
			height:55px;
			left:103px;
			top:336px;
			margin:auto;
			background:url("Page/huodong1.png") no-repeat center center;
			background-size:100%;
		}
		#rightpage>.first{
			position:absolute;
			width:398px;
			height:345px;
			right:0;
			top:0;
			margin:auto;
			background:url("Page/before1.png") no-repeat center center;
			background-size:100%;
		}
		#rightpage>.second{
			position:absolute;
			width:398px;
			height:392px;
			right:162px;
			top:282px;
			margin:auto;
			background:url("Page/before2.png") no-repeat center center;
			background-size:100%;
		}
		#rightpage>.third{
			position:absolute;
			width:398px;
			height:357px;
			right:513px;
			bottom:0;
			margin:auto;
			background:url("Page/before3.png") no-repeat center center;
			background-size:100%;
		}
		
		</style>
	</head>
		<div class="shouye" id="page1">
			<div class="bg" id="back"></div>
			<div class="shouye" id="leftpage">
				<div class="left01" id="button1" onclick="zhongjiang()"></div>
				<div class="left02" id="button2" onclick="xiangqing()"></div>
			</div>
			<div class="shouye" id="rightpage">
				<div class="first" id="one" onclick="dogdinggou()"></div>
				<div class="second" id="two" onclick="dinggouwd()"></div>
				<div class="third" id="three" onclick="dinggoujsc()"></div>
			</div>

		</div>

		<script type="text/javascript">




		var b=true;
		function dinggoujsc(){
			if(b){
				b=false;
				if(jscpay=="pay"){
				abc.toJianShenCao();
				}else{
				abc.funFromJsc();
				}
			}
		}
		var c=true;
		function dinggouwd(){
			if(c){
			c=false;
				if(wdpay=="pay"){
				abc.toWudao();
				}else{
				abc.funFromWd();
				}
			}

		}
		var a=true;
		function dogdinggou(){
			if(a){
				a=false;
				if(dogpay=="pay"){
				abc.toWangWangba();
					}else{
				abc.fromAndroidDog();
				}
			}

		}
		function getMessage(){
			var s=abc.FromAndroid();
		}
		var s=abc.FromAndroid();
		var jscpay=abc.isZhiFu();
		var dogpay=abc.isZhiFuDog();
		var wdpay=abc.isZhiFuWd();
		console.log("jscpay:"+jscpay+"wdpay:"+wdpay+"dogpay:"+dogpay);
		var list=s.split(",");
		var arr=new Array();
		for(var i=0;i<list.length;i++){

			arr[i]=list[i];
		}

		var a="";
		for(var i=0;i<arr.length;i++){
			a+="<li>"+arr[i]+"</li>"+"<hr>";
		}


		window.onload=function(){
			var page1=document.getElementById("page1");

			var cloud=document.getElementById("cloud3");

			var button1=document.getElementById("button1");
			var button2=document.getElementById("button2");

			var one=document.getElementById("one");
			var two=document.getElementById("two");
			var three=document.getElementById("three");

			var jsc=abc.isZhiFu();
			var dog=abc.isZhiFuDog();
			var wd=abc.isZhiFuWd();
			if(jsc=="pay"||wd=="pay"){
			two.style.background="url(Page/paywdbefore.png) no-repeat center center"
			three.style.background="url(Page/payjscbefore.png) no-repeat center center"
			}
			if(dog=="pay"){
			one.style.background="url(Page/paydogbefore.png) no-repeat center center"
			}
			console.log("wd:"+wd);

			function zhongjiang(){
			console.log("zhongjiang");
			window.location.href="zhongjiang.html";
			}
			function xiangqing(){
			window.location.href="xiangqing.html";
			}





			button1.onfocus=handFocus1;
			button1.onblur=handFocus1;
			function handFocus1(e){
				if(e.type=="focus"){
					e.target.style.background="url(Page/zhongjiang2.png) no-repeat center center";
					e.target.style.outline="none";
				}else{
					e.target.style.background="url(Page/zhongjiang1.png) no-repeat center center";
				}
			}
			button2.onfocus=handFocus2;
			button2.onblur=handFocus2;
			function handFocus2(e){
				if(e.type=="focus"){
					var id=document.activeElement.id;
					console.log("button 2 focus !!!"+id)
					e.target.style.background="url(Page/huodong2.png) no-repeat center center";
					e.target.style.outline="none";
				}else{
					console.log("button 2 blur ~~~")
					e.target.style.background="url(Page/huodong1.png) no-repeat center center";
				}
			}

			one.focus();
			one.onfocus=handBlock1;
			one.onblur=handBlock1;
			function handBlock1(e){
				if(e.type=="focus"){
				console.log("dog值为:"+dog);
					if(dog=="pay"){
					e.target.style.background="url(Page/paydog.png) no-repeat center center";
					e.target.style.outline="none";
					}else{
					e.target.style.background="url(Page/after1.png) no-repeat center center";
					e.target.style.outline="none";
					}

				}else{
				if(dog=="pay"){
					e.target.style.background="url(Page/paydogbefore.png) no-repeat center center";
				}else{
					e.target.style.background="url(Page/before1.png) no-repeat center center";
				}

				}
			}
			two.onfocus=handBlock2;
			two.onblur=handBlock2;
			function handBlock2(e){
				if(e.type=="focus"){
				console.log(wd==true+"@@"+wd);
					if(wd=="pay"||jsc=="pay"){
					console.log("@@"+wd);
					e.target.style.background="url(Page/paywd.png) no-repeat center center";
					e.target.style.outline="none";
					}else{
					button2.removeEventListener("click", handFocus2);
					e.target.style.background="url(Page/after2.png) no-repeat center center";
					e.target.style.outline="none";
					}

				}else{
					if(wd=="pay"||jsc=="pay"){
					e.target.style.background="url(Page/paywdbefore.png) no-repeat center center";
					}else{
					e.target.style.background="url(Page/before2.png) no-repeat center center";
					}
				}
			}
			three.onfocus=handBlock3;
			three.onblur=handBlock3;
			function handBlock3(e){
				if(e.type=="focus"){
					if(jsc=="pay"||wd=="pay"){
					e.target.style.background="url(Page/payjsc.png) no-repeat center center";
					e.target.style.outline="none";
					}else{
					e.target.style.background="url(Page/after3.png) no-repeat center center";
					e.target.style.outline="none";
					}

				}else{
					if(jsc=="pay"||wd=="pay"){
					e.target.style.background="url(Page/payjscbefore.png) no-repeat center center";
					}else{
					e.target.style.background="url(Page/before3.png) no-repeat center center";
					}

				}
			}
			document.onkeydown=function(en){
				en=window.event||en;
				var ide=document.activeElement.id;
				if(en.keyCode==37&&ide=="two"){				//第二个向左
					console.log("第二个向左");
					button1.focus();

				}else if(en.keyCode==39&&ide=="three"){		//第三个向右

					two.focus();

				}else if(en.keyCode==39&&ide=="two"){		//第二个向右
					one.focus();

				}else if(en.keyCode==38&&ide=="three"){		//第三个向上
					two.focus();

				}else if(en.keyCode==38&&ide=="two"){		//第二个向上
					one.focus();

				}else if(en.keyCode==40&&ide=="one"){		//第一个向下
					two.focus();

				}else if(en.keyCode==40&&ide=="two"){
					three.focus();

				}else if(en.keyCode==37&&ide=="three"){
					button1.focus();
				}else if(en.keyCode==event.KEYCODE_BACK&&ide=="button1"){
					back.focus();
				}else if(en.keyCode==13&&ide=="button1"){
					zhongjiang();
				}else if(en.keyCode==13&&ide=="button2"){
					xiangqing();
				}else if(en.keyCode==13&&ide=="one"){
				dogdinggou();
				}else if(en.keyCode==13&&ide=="two"){
				dinggouwd();
				}else if(en.keyCode==13&&ide=="three"){
				dinggoujsc();
				}
			}

		}


		</script>
	</body>
</html>